<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>用户管理</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <link rel="stylesheet" href="../../layui/css/layui.css" media="all"/>
    <link rel="stylesheet" href="../../css/news.css"/>
    <style>
        #demo1 {
            float: right;
        }
    </style>
</head>

<body class="childrenBody">
<blockquote class="layui-elem-quote news_search">
    <div class="layui-inline">
        <div class="layui-input-inline">
            <input type="text" value="" placeholder="用户昵称/手机号" class="layui-input search_input" id="sname">
        </div>
        <div class="layui-input-inline" style="height: 38px;">
            <form class="layui-form" action="">
                <div class="layui-form-item">
                    <select name="modules" lay-verify="required" id="sstatus">
                        <option value="">状态</option>
                        <option value="">不限</option>
                        <option value="0">启用</option>
                        <option value="-1">禁用</option>
                    </select>
                </div>
            </form>
        </div>
        <!--<div class="layui-input-inline">-->
            <!--<input class="layui-input" placeholder="开始日" id="startTime">-->
        <!--</div>-->
        <!--<div class="layui-input-inline">-->
            <!--<input class="layui-input" placeholder="截止日" id="endTime">-->
        <!--</div>-->

    </div>
    <a class="layui-btn layui-btn-primary" id="search"><i class="layui-icon">&#xe615;</i>查询</a>
    </div>
</blockquote>

<div class="left_list">
    <div class="layui-inline">
        <a class="layui-btn layui-btn-normal newsAdd_btn">添加用户</a>
    </div>

    <div class="layui-inline">
        <a class="layui-btn recommend news_status" style="background-color:#5FB878"
           onclick="changeListItem(0)">启用用户</a>
    </div>

    <div class="layui-inline">
        <a class="layui-btn audit_btn news_status" onclick="changeListItem(1)">冻结用户</a>
    </div>

    <div class="layui-inline">
        <a class="layui-btn layui-btn-danger news_del" onclick="changeListItem(2)">批量删除</a>
    </div>
</div>
<div class="layui-form-mid layui-word-aux">用户冻结，暂时不能登录。启用变正常。删除时，用户之前产生的信息还在，永远不能登录，手机号可重新注册。</div>
<form action="" class="layui-form table-box">

    <div id="listView"></div>
    <div id="laypage" class="laypage"></div>

</form>

<div id="newsAdd" class="hide">
    <form class="layui-form" action="" style="padding: 20px;" id="afrom">
        <div class="layui-form-item">
            <label class="layui-form-label">用户昵称</label>
            <div class="layui-input-block">
                <input type="text" name="title" lay-verify="title" placeholder="请输入用户昵称" class="layui-input" id="name">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">手机号</label>
            <div class="layui-input-block">
                <input type="number" name="title" lay-verify="title" placeholder="手机号" class="layui-input"
                       id="username">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">登录密码</label>
            <div class="layui-input-block">
                <input type="text" name="title" lay-verify="title" placeholder="请输入登录密码" class="layui-input"
                       id="password">
            </div>
        </div>
    </form>
</div>
<input id="mid" value="" type="hidden"/>
<script type="text/javascript" src="../../layui/layui.js"></script>
<script type="text/javascript" src="../../js/jquery-1.8.2.min.js"></script>
<script type="text/javascript" src="../../js/time.js"></script>
<script src="../../layui/layui.all.js" type="text/javascript" charset="utf-8"></script>
<script src="../../js/common.js" type="text/javascript" charset="utf-8"></script>
<script id="tmpList" type="text/html">

    <table class="layui-table" lay-even lay-skin="row">
        <thead>
        <tr>
            <th><input type="checkbox" name="" lay-skin="primary" lay-filter="allChoose"></th>
            <th>序号</th>
            <th>昵称</th>
            <th>手机号</th>
            <th>余额（元）</th>
            <th>状态</th>
            <th>创建时间</th>
            <th>操作</th>
        </tr>
        </thead>
        <tbody>
        {{# layui.each(d.list, function(index, item){ }}

        <tr>
            <td><input type="checkbox" value="{{ item.id }}" name="" lay-skin="primary"></td>
            <td>{{index+1}}</td>
            <td>{{ item.nickname }}</td>
            <td>{{ item.phone }}</td>
            <td>{{ item.money}}</td>
            <td>
                {{#if (item.status == 0) {}}
                <input type="checkbox" checked="" name="open" lay-skin="switch" lay-filter="switchTest" lay-text="启用|禁用"
                       value="{{item.id}}" )>
                {{#} else {}}
                <input type="checkbox" name="open" lay-skin="switch" lay-filter="switchTest" lay-text="启用|禁用"
                       value="{{item.id}}" )>
                {{#}}}
            </td>
            <td>{{formatDate(item.create_time)}}</td>
            <td>
                <a class="layui-btn layui-btn-mini news_details" onclick=details({{item.id}})><i
                        class="layui-icon">&#xe642;</i>详情</a>
                <a class="layui-btn layui-btn-danger layui-btn-mini news_del" onclick=deletex({{item.id}})><i
                        class="layui-icon">&#xe640;</i>删除</a>
            </td>
        </tr>
        {{# }); }} {{# if(d.list.length === 0){ }}
        <td colspan="10" align="center">无数据</td>
        {{# } }}
        </tbody>
    </table>
</script>

<script>
//    layui.use('laydate', function () {
//        var laydate = layui.laydate;
//
//        //开始时间
//        laydate.render({
//            elem: '#startTime'
//        });
//        //结束时间
//        laydate.render({
//            elem: '#endTime'
//        });
//    });


    //批量操作
    function changeListItem(PL) {
        var box = $("input[lay-filter='allChoose']").prop("checked");
        var child = $("input[lay-filter='allChoose']").parents('table').find('tbody tr td:first-child input[type="checkbox"]:checked');
        var valueList = [];
        for (var i = 0; i < child.length; i++) {
            var item = parseInt(child.eq(i).attr("value"));
            valueList.push(item);

        }
        switch (PL) {
            case 0:
                modifyStatus(valueList, 0);
                break;
            case 1:
                modifyStatus(valueList, -1);
                break;
            default:
                deleteAll(valueList);
                break;
        }

    }
    //批量删除
    function deleteAll(Items) { //obj=整条数据行
        if (Items.length > 0) {
            layer.confirm('是否删除选中项？', {
                btn: ['是', '否'] //按钮
            }, function (index, layero) {

                for (var i = 0; i < Items.length; i++) {
                    $.ajax({
                        type: "post",
                        url: "delUser",
                        data: {
                            id: Items[i]
                        },
                        dataType: "json",
                        success: function (data) {
                            if (data.status == 0) {
                                //console.log("删除："+Items[i]);
                                getList({});
                            } else {
                                layer.msg(data.msg, {
                                    icon: 1
                                });
                            }
                        }
                    });
                }
                layer.msg('删除成功', {
                    icon: 1
                });

                layer.close(index);

            }, function () {
            });
        } else {
            layer.msg('未选择无法操作！', {
                icon: 7
            });
        }
    }

    //批量状态
    function modifyStatus(Items, status) { //obj=整条数据行
        if (Items.length > 0) {
            var text;
            if (status == -1) {
                text = "禁用";
            } else {
                text = "启用";
            }
            layer.confirm('是否' + text + '选中项？', {
                btn: ['是', '否'] //按钮
            }, function (index, layero) {

                for (var i = 0; i < Items.length; i++) {
                    $.ajax({
                        type: "post",
                        url: "modifyUserStatus",
                        data: {
                            id: Items[i],
                            status: status
                        },
                        dataType: "json",
                        success: function (data) {
                            if (data.status == 0) {
                                getList({});
                            } else {
                                layer.msg(data.msg, {
                                    icon: 1
                                });
                            }
                        }
                    });
                }
                layer.msg(text + '成功', {
                    icon: 1
                });
                layer.close(index);

            }, function () {

            });
        } else {
            layer.msg('未选择无法操作！', {
                icon: 7
            });
        }
    }

    $(document).ready(function () {

        $("#search").click(function () {

//            if ($('#startTime').val() != "" && $('#endTime').val() == "") {
//                layer.msg('请选择截止日！', {
//                    icon: 7
//
//                });
//                return;
//            }
//            if ($('#startTime').val() == "" && $('#endTime').val() != "") {
//                layer.msg('请选择开始日！', {
//                    icon: 7
//                });
//                return;
//            }
            getList({
//                startTime: $('#startTime').val(),
//                endTime: $('#endTime').val(),
                status: $('#sstatus').val(),
                searchKey: $('#sname').val()
            });
        });
        getList({});


    });

    function getList(data) {
        //	CommonLoadList("../console/account/list", data, page, "tmpList", "listView", "laypage");
        CommonLoadList("getUserList", data, page, "tmpList", "listView", "laypage");
    }

    //点击添加文章弹窗（小弹窗）
    $(".newsAdd_btn").click(function () {
        layui.use('layer', function () {//独立版的layer无需执行这一句
            var indexlay;
            var layedit;
            var $ = layui.jquery,
                layer = layui.layer; //独立版的layer无需执行这一句
            layer.open({
                type: 1,
                title: '添加经销商',
                area: ['800px', '600px'],
                content: $("#newsAdd"),
                btn: ['提交', '关闭'],
                btnAlign: 'c',
                success: function (layero, index) {
                },
                yes: function (index, layero) {

                    if ($("#username").val() == "") {
                        layer.msg('请输入手机号', {icon: 2});
                        return;
                    }
                    if ($("#name").val() == "") {
                        layer.msg('请输入经销商名称', {icon: 2});
                        return;
                    }
                    if ($("#password").val() == "") {
                        layer.msg('请输入密码', {icon: 2});
                        return;
                    }
                    if ($("#status").val() == "") {
                        layer.msg('请选择状态', {icon: 2});
                        return;
                    }
                    $.ajax({
                        type: "post",
                        url: "addUser",
                        data: {
                            username: $("#username").val(),
                            realname: $("#name").val(),
                            password: $("#password").val()
                        },
                        dataType: "json",
                        success: function (data) {
                            if (data.status == 0) {
                                var index = parent.layer.getFrameIndex(window.name);
                                var index = top.layer.msg('数据提交中，请稍候', {icon: 16, time: false, shade: 0.8});
                                setTimeout(function () {
                                    top.layer.close(index);
                                    top.layer.msg("添加成功！");
                                    layer.closeAll("iframe");
                                    //刷新父页面
                                    parent.location.reload();
                                }, 500);
                                $('#afrom')[0].reset();
                                getList({});
                                $("#newsAdd").hide();
                                layer.close(index); //如果设定了yes回调，需进行手工关闭
                            } else {
                                layer.msg(data.msg, {icon: 1});
                            }
                        }
                    });

                },
                btn2: function (index, layero) {
                    //按钮【按钮二】的回调
                    //return false 开启该代码可禁止点击该按钮关闭
                    $("#newsAdd").hide();
                    $('#afrom')[0].reset();
                },
                cancel: function () {
                    $("#newsAdd").hide();
                    //右上角关闭回调
                    //return false 开启该代码可禁止点击该按钮关闭
                }
            });
        });
    })

    function detail(id) {

        layer.msg("详情页面待开发");

    }

    function deletex(id) {
        //点击删除按钮
        layer.confirm('是否删除？', {
            btn: ['是', '否'] //按钮
        }, function () {
            $.ajax({
                type: "post",
                url: "delUser",
                data: {
                    id: id
                },
                dataType: "json",
                success: function (data) {
                    if (data.status == 0) {
                        layer.msg('删除成功', {
                            icon: 1
                        });
                        getList({});
                        layer.close(index);
                    } else {
                        layer.msg(data.msg, {
                            icon: 1
                        });
                    }
                }
            });
        }, function () {
        });
    }

    //状态开关
    layui.use('form', function () {
        var form = layui.form
        form.on('switch(switchTest)', function (data) {
            var status;
            if (this.checked) {
                status = 0;
            } else {
                status = -1;
            }
            var text = '';
            if (status == 0) {
                text = "启用";
            } else {
                text = "禁用";
            }
            $.ajax({
                type: "post",
                url: "modifyUserStatus",
                data: {
                    id: $(this).val(),
                    status: status,
                },
                dataType: "json",
                async: false,
                success: function (data) {
                    if (data.status == 0) {
                        layer.msg(text + '成功', {
                            icon: 1
                        });
                    } else {
                        layer.msg(data.msg, {
                            icon: 1
                        });
                    }
                }
            });
        });
    });
</script>
</body>

</html>